/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
/*
 *Atributos
 */
Container.prototype = new Element();
Container.prototype.constructor = Element;
Container.prototype.items = [];
Container.prototype._elements = [];
Container.prototype.layout = '';
Container.prototype.title = '';
Container.prototype.border = true;
Container.prototype._isInner = false;

//en caso que sea formulario
Container.prototype.isForm = false;
//botones de accion inferiores
Container.prototype.buttons = [];
Container.prototype.modal = false;

Container.prototype._deep = 0;
Container.prototype._fixWidth = 7;

/*
 *Metodos
 */

Container.prototype.makeTitle = function(){
    if(!this._isInner){
        return '<div class="'+this.CLASSNAMES.CONTAINER_TITLE+'">'+this.title+'</div>';
    }
    else    return '<div class="'+this.CLASSNAMES.SUB_CONTAINER_TITLE+'">'+this.title+'</div>';
};

Container.prototype.makeButtons = function(){
    if(!this._isInner){
        return '<div class="'+this.CLASSNAMES.CONTAINER_BUTTONS_AREA+'"></div>';
    }
};

Container.prototype.makeBody = function(){
    if(!this._isInner){
        return '<div class="'+this.CLASSNAMES.CONTAINER_BODY+'"></div>';
    }
};

//crea el div content principal
Container.prototype.makeHtml = function(){
    this.Classes.push(this.CLASSNAMES.CONTAINER);
    var title = '';
    if(this.title && this._isInner){
        title = '<div class="'+this.CLASSNAMES.SUB_CONTAINER_TITLE+'">'+this.title+'</div>';
    }
    
    var classes = this._getClassesString();
    
    return title+'<div id="'+this.id+'" class="'+classes+'"></div>';
};
//recorre pool de objetos items y crea los Element correpsondientes
Container.prototype.createElements = function(){
    var _this = this;
    jQuery.each(this.items, function(i,item){
        if(item.type){
            var newElement = null;
            item._isInner = true;
            item._parent = _this;
            item._deep = _this._deep+1;
            
            switch(item.type){
                case "container":
                    newElement = new Container(item);
                    break;
                case "button":
                    newElement = new Button(item);
                    break;
                case "textfield":
                    newElement = new TextField(item);
                    break;
            }
            if(newElement!=null){
                
                if(_this.layout){
                    switch(_this.layout){
                        case "vbox":
                            _this.addRow(newElement);
                            break;
                        case "hbox":
                            _this.addColumn(newElement);
                            break;
                    }
                }
                else{
                    _this.add(newElement);
                }
                
                //si es container luego de haber creado su tag html rendereamos sus elementos internos
                if(newElement instanceof Container){
                    if(newElement.items && newElement.items.length>0){
                        newElement.createElements();
                    }
                    
                    if(newElement.border == false){
                        jQuery(newElement.jID()).css('border','none');
                    }
                }
            }
            else{
                throw "The type of Object [" +item.type+ "] is invalid";
            }
        }
        else{
            throw "You must set the Type of Rocket element [button, container, select, .. etc.]";
        }
    });
    
    
    
    return;
}
/*
 * crea nuevo div con classe row de bootstrap
 */
Container.prototype.addRow = function(item){
    var row = "<div style='margin-left:0;' class='"+this.CLASSNAMES.BT_ROW+"'>"+item.makeHtml()+"</div>";
    this.addItem(item);
    this._elements.push(item);
    
    if(this._isInner)
        jQuery(this.jID()).append(row);
    else jQuery(this.jID()+" ."+this.CLASSNAMES.CONTAINER_BODY).append(row);
//    if(!this.isInner)
//        jQuery(this.jID()+" ."+this.CLASSNAMES.CONTAINER_BODY).append(row);
//    else    jQuery(this.jID()).append(row);
    
    var padding, nItems, containerWidth, width;
    
    if(item instanceof Container){
        padding = item._fixWidth;
        containerWidth = jQuery(this.jID()).width();
        var border = parseInt(jQuery(this.jID()).css('border-width'));
        width = containerWidth-(2*padding)-2*border;
        jQuery(item.jID()).width(width+'px');
    }
    
    
}

/*
 * crea nuevo div con classe column para simular horizontal box
 */
Container.prototype.addColumn = function(item){
    var id = this.makeUId();
    var row = "<div id='"+id+"' style='margin-left:0;' class='"+this.CLASSNAMES.HBOX+"'>"+item.makeHtml()+"</div>";
    
    if(this._isInner)
        jQuery(this.jID()).append(row);
    else jQuery(this.jID()+" ."+this.CLASSNAMES.CONTAINER_BODY).append(row);
    
    this.addItem(item);
    this._elements.push(item);
    
    var padding, nItems, containerWidth, width;
    
    
    
    if(item instanceof Container){
        
        
        padding = this._fixWidth;
        containerWidth = jQuery(this.jID()).width();
        var border = parseInt(jQuery(this.jID()).css('border-width'));
        width = (containerWidth-(2*padding)-2*border);
        width = width/parseInt(this.items.length);

        jQuery("#"+id).width(width+'px');
        
        
        
        
        var border = parseInt(jQuery(this.jID()).css('border-width'));
        var _width = width-2*padding-2*border;
        jQuery(item.jID()).width(_width+'px');
        var margin_left = parseInt((width-_width)/(this.items.length-1))-1;
//        jQuery("#"+id).css('margin-left',margin_left);
        jQuery("#"+id).css('margin-left',padding);
    //        width = width+2*padding+2*border;
    }
//    else{
//        
//    }
    
}

Container.prototype.add = function(item){
    if(!this._isInner)
        jQuery(this.jID()+" ."+this.CLASSNAMES.CONTAINER_BODY).append(item.makeHtml());
    else    jQuery(this.jID()).append(item.makeHtml());
    
    this.addItem(item);
    this._elements.push(item);
}

Container.prototype.createButtons = function(){
    var _this = this;
    jQuery.each(this.buttons, function(i,item){
        var newElement = null;
        item._isInner = true;
        item._parent = _this;
        item._deep = _this._deep+1;
        newElement = new Button(item);
        if(newElement!=null){
            var id = _this.makeUId();
            var row = "<div id='"+id+"' style='margin-left:0;' class='"+_this.CLASSNAMES.HBOX+"'>"+newElement.makeHtml()+"</div>";
            jQuery(_this.jID()+" .rck-container-buttons-area").append(row);
            _this.addItem(item);
            _this._elements.push(item);
        }
        else{
            throw "The type of Object [" +item.type+ "] is invalid";
        }
    });
    return;
}


Container.prototype.create = function(options){
    var _this = this;
    
    this._elements = new Array();
    
    this.setOptions(options);
    
    var jId = "#"+this._id;
    var jRenderTo = "#"+this.renderTo;
    
    //si posee tag donde insertar html
    if(this.renderTo && !this._isInner){
        //creamos html de element
        jQuery(jRenderTo).html(this.makeHtml());
        
        jQuery(this.jID()).prepend(this.makeTitle());
        
        jQuery(this.jID()).append(this.makeBody());
        

        if(!this.width) this.width = '100%';
        
        //seteamos medidas
        if(this.width){
            this.setWidth(this.width);
            //fix de width
            var containerWidth = jQuery(_this.jID()).width();
            var padding = _this._fixWidth;
            var border = parseInt(jQuery(_this.jID()).css('border-width'));
            var width = containerWidth-(2*padding)-2*border;
            jQuery(_this.jID()).width(width+'px');
        }
        if(this.height)
            this.setHeight(this.height);
        
        if(this.items && this.items.length>0){
            this.createElements();
        }
        
        if(this.isForm){
            jQuery(this.jID()).append(this.makeButtons());
            if(this.buttons){
                this.createButtons();
            }
            
            if(this.modal){
                jQuery(this.jID()).addClass("modal");
            }
        }
            
    }

    if(this.border == false){
        jQuery(_this.jID()).css('border','none');
    }
    
    return this;
}

Container.prototype.getRootParent = function(){
    var _this = this;
    var go = true;
    while(_this._parent){
        _this = _this._parent;
    }
    return _this;
}

Container.prototype.getRootWidth = function(){
    return this.getRootParent().width;
}

function Container(options){
    this.create(options);
}

